<template>
  <div class="Mian">
    <el-container style="height: 100vh; border: 1px solid #eee">
      <el-aside width="200px" style="background-color: #20222a">
        <el-menu
          router
          :default-openeds="['1']"
          unique-opened
          :default-active="$route.path"
        >
          <el-submenu index="1">
            <template #title><i class="el-icon-s-grid"></i>内容管理</template>
            <el-menu-item index="/items/create">新建物品</el-menu-item>
              <el-menu-item index="/items/list">物品列表</el-menu-item>
              <el-menu-item index="/heroes/create">新建英雄</el-menu-item>
              <el-menu-item index="/heroes/list">英雄列表</el-menu-item>
              <el-menu-item index="/articles/create">新建文章</el-menu-item>
              <el-menu-item index="/articles/list">文章列表</el-menu-item>
              <el-menu-item index="/namedes/list">测试</el-menu-item>
            <!-- <el-menu-item-group>
              
            </el-menu-item-group> -->
          </el-submenu>
          <el-submenu index="2">
            <template #title><i class="el-icon-setting"></i>系统管理</template>
            <el-menu-item index="/categories/create">新建分类</el-menu-item>
              <el-menu-item index="/categories/list">分类列表</el-menu-item>
              <el-menu-item index="/admin_user/create">新建管理员</el-menu-item>
              <el-menu-item index="/admin_user/list">管理员列表</el-menu-item>
          </el-submenu>
          <el-submenu index="3">
            <template #title><i class="el-icon-help"></i>运营管理</template>
             <el-menu-item index="/ads/create">新建广告</el-menu-item>
             <el-menu-item index="/ads/list">广告列表</el-menu-item>
          </el-submenu>
        </el-menu>
      </el-aside>

      <el-container>
        <el-header
          style="
            text-align: right;
            font-size: 20px;
            background-color: #444;
            color: #fff;
          "
        >
          <!-- <el-dropdown>
            <i class="el-icon-setting" style="margin-right: 15px;font-size: 20px;"></i>
            <template #dropdown>
              <el-dropdown-menu>
                <el-dropdown-item>查看</el-dropdown-item>
                <el-dropdown-item>新增</el-dropdown-item>
                <el-dropdown-item>删除</el-dropdown-item>
              </el-dropdown-menu>
            </template>
          </el-dropdown> -->
          <span>憨憨俱乐部</span>
        </el-header>

        <el-main class="elmainade">
          <!-- 子路由切换区 -->
          <router-view>
            
          </router-view>
           <!-- <img src="../assets/HHAA.png" alt=""> -->
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  data() {
    const item = {
      date: "2016-05-02",
      name: "王小虎",
      address: "上海市普陀区金沙江路 1518 弄",
    };
    return {
      tableData: Array(20).fill(item),
    };
  },
};
</script>
<style>
.el-header {
  background-color: #b3c0d1;
  color: #333;
  line-height: 60px;
}
.el-aside {
  color: #333;
}
.elmainade{
  margin: 20px;
  padding: 0px;
  border: 1px solid #DCDFE6;
  box-shadow:0px 0px  30px 2px #aaa;
  border-radius: 10px;
  background: url('../assets/HHAA.png')100% 20% no-repeat;
}
</style>
